import React from 'react'
import { Tabbar, TabbarItem } from 'react-vant'
import { FriendsO, HomeO, Search, SettingO } from '@react-vant/icons'
import { Outlet, NavLink } from 'react-router-dom'
type Props = {}

const Home = (props: Props) => {
  return (
    <div>
      <div><Outlet /> </div>
      <div>
        <Tabbar>
          <TabbarItem icon={<HomeO />}>
            <NavLink to='/home/index'>首页</NavLink>
          </TabbarItem>
          <TabbarItem icon={<Search />}>
            <NavLink to='/home/order'>订单</NavLink>
          </TabbarItem>
          <TabbarItem icon={<FriendsO />}>
            <NavLink to='/home/customer'>客服</NavLink>
          </TabbarItem>
          <TabbarItem icon={<SettingO />}>
            <NavLink to='/home/my'>我的</NavLink>
          </TabbarItem>
        </Tabbar>
      </div>
    </div>
  )
}

export default Home